<template>
  <a-config-provider :locale="locale">
    <div id="app" class="loadingBox">
      <a-spin
        :spinning="
          this.$store.state.startLoad ? this.$store.state.loadding != 0 : false
        "
        tip="加载中..."
        style="height: 100%;"
      >
        <keep-alive>
          <router-view v-if="$route.meta.keepAlive"></router-view>
        </keep-alive>
        <router-view v-if="!$route.meta.keepAlive"></router-view>
      </a-spin>
    </div>
  </a-config-provider>
</template>

<script>
import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'

export default {
  name: 'App',
  data () {
    return {
      locale: zhCN
    }
  },
  watch: {
    $route: function (to, from) {
      if (document.getElementsByClassName('ant-layout-content').item(0)) {
        document
          .getElementsByClassName('ant-layout-content')
          .item(0).scrollTop = 0
      }
    }
  }
}
</script>

<style lang="scss">
#app {
  font-family: PingFang-SC, 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 100%;
  height: 100%;
}

.loadingBox .ant-spin-nested-loading {
  height: 100% !important;
}

.loadingBox .ant-spin-nested-loading .ant-spin-container {
  height: 100% !important;
}

.backlogTitle .ant-spin-nested-loading .ant-spin-container {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.search-input {
  font-size: 13px !important;
  padding: 4px 7px !important;
}

.ant-select {
  font-size: 13px !important;
}

body {

  &::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  &::-webkit-scrollbar-track {
    -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.3);
    border-radius: 10px;
  }

  &::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #18171723;
    -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.5);
  }
}

.ant-table-body {
  &::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  &::-webkit-scrollbar-track {
    -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.3);
    border-radius: 10px;
  }

  &::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #18171723;
    -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.5);
  }
}

.ant-modal-body {
  &::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  &::-webkit-scrollbar-track {
    -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.3);
    border-radius: 10px;
  }

  &::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: #18171723;
    -webkit-box-shadow: inset006pxrgba(0, 0, 0, 0.5);
  }
}
</style>
